<template>
  <div class="my_container" style="height: calc(100% - 53px)">
    <van-search v-model="keyword" placeholder="请输入搜索关键词" @search="onSearch"> </van-search>
    <div style="height: calc(100% - 44px - 5px); overflow: scroll; margin-top: 5px">
      <van-cell clickable size="large" style="margin-bottom: 3px" @click="go_back(item)" v-for="item in listView" :key="item.Pk" icon="home-o" :title="item.PlaceCode">
        <template #right-icon>
          <van-icon v-if="item.Pk === currentSelected" name="passed" />
        </template>
      </van-cell>
      <van-empty v-if="listView?.length === 0" image="search" description="当前没有数据" />
    </div>
    <van-overlay :show="loading">
      <div class="loading_wrapper"><van-loading type="spinner" size="24" /></div
    ></van-overlay>
  </div>
</template>
<script setup lang="ts">
import { listPlace } from '@/api/place';
import type { PlaceModel } from '@/model/placemodel';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';

const loading = ref(false);
const finished = ref(false);
const list = ref<PlaceModel[]>();
const listView = ref<PlaceModel[]>();
const router = useRouter();
const currentSelected = ref();
const keyword = ref('');
const onSearch = () => {
  const v = keyword.value;
  listView.value = list.value?.filter((r) => {
    if (!v || v.length === 0) return true;
    const v_as_upper = v.toUpperCase();
    return r.PlaceCode!.toUpperCase().indexOf(v_as_upper) >= 0 || r.PlaceName!.toUpperCase().indexOf(v_as_upper) >= 0 || (r.PlaceGroup && r.PlaceGroup!.toUpperCase().indexOf(v_as_upper) >= 0);
  });
};
const onLoad = () => {
  loading.value = true;
  listPlace()
    .then((r) => {
      list.value = r.Data;
      listView.value = list.value;
      loading.value = false;
      finished.value = true;
    })
    .catch((e) => {
      loading.value = false;
    });
};
onMounted(() => {
  const r = router.currentRoute.value;
  const place_pk = r.query.place;
  currentSelected.value = place_pk;
  onLoad();
});

const go_back = (item: PlaceModel) => {
  const data = { _k: item.Pk, _v1: item.PlaceCode, _v2: item.PlaceName };
  router.replace({ path: '/stockin', query: { place: JSON.stringify(data) } });
};
</script>

<style scoped></style>
